---
id: menubar
title: Menubar
sidebar_label: Menubar
---

The Menubar component provides a customizable and accessible menu bar, built using Radix UI Menubar primitives. It can be used to create complex menu structures with various functionalities such as submenus, checkboxes, and radio groups.

## Usage

To use the `Menubar`, import it from your components and compose it with other related Menubar components like `MenubarMenu`, `MenubarTrigger`, `MenubarContent`, `MenubarItem`, etc.

import CodeSample from "../../src/CodeSample";
import CodeBlock from "@theme/CodeBlock";

## Menubar Example

A menubar showcasing all the basic functionalities of the Menubar component.

import MenubarDemo from '../../samples/components/menubar/menubar_demo.tsx';
import MenubarSource from '!!raw-loader!../../samples/components/menubar/menubar_demo';

<CodeSample>
    <MenubarDemo/>
</CodeSample>

<CodeBlock language="tsx">{MenubarSource}</CodeBlock>
